<template>
	<view class="f28r col313131">
		<navbar background="background-image: linear-gradient(to right, #2c6739, #99c043);"
			title="收益明细" back @onBack="goBack" @topTotalHeight="topTotalHeight"
		></navbar>
		<view class="disFlex teAliCenter lh88r backColWhite borB1SE6e6e6">
			<view :class="['flex1', 'poRel', timeStatus == 0 ? 'col99c043 foWeiBold' : ''
				]" @click="timeSwitch(0)"
			>
				全部
				<text class="poAbs left50P trTrXn50P bom0 backCol99c043 h6r w50r"
					v-show="timeStatus == 0"
				></text>
			</view>
			<view :class="['flex1', 'poRel', timeStatus == 1 ? 'col99c043 foWeiBold' : ''
				]" @click="timeSwitch(1)"
			>
				本月
				<text class="poAbs left50P trTrXn50P bom0 backCol99c043 h6r w50r"
					v-show="timeStatus == 1"
				></text>
			</view>
			<view :class="['flex1', 'poRel', timeStatus == 2 ? 'col99c043 foWeiBold' : ''
				]" @click="timeSwitch(2)"
			>
				上月
				<text class="poAbs left50P trTrXn50P bom0 backCol99c043 h6r w50r"
					v-show="timeStatus == 2"
				></text>
			</view>
		</view>
		<swiper @change="swiperChaFun" :current="timeStatus"
			:style="'min-height: ' + 'calc(100vh - ' + calcNum + 'px);'"
		>
			<swiper-item class="overYS">
				<view class="lh60r pl40r backColFdf1e1 colEead45 f26r">
					全部累计奖励收益：{{totalAmount0 ? totalAmount0 : 0}}元
				</view>
				<scroll-view scroll-y="true" class="hPer100C60r" @scrolltolower="orderScroll"
					:refresher-enabled="true" :refresher-triggered="data0Tri"
					@refresherrefresh="orderRefresh"
				>
					<incomeList :incomeData="data0List" :incomeMore="data0More"
					></incomeList>
				</scroll-view>
			</swiper-item>
			<swiper-item class="overYS">
				<view class="lh60r pl40r backCol99c043 colFff f26r">
					本月累计奖励收益：{{totalAmount1 ? totalAmount1 : 0}}元
				</view>
				<scroll-view scroll-y="true" class="hPer100C60r" @scrolltolower="orderScroll"
					:refresher-enabled="true" :refresher-triggered="data1Tri"
					@refresherrefresh="orderRefresh"
				>
					<incomeList :incomeData="data1List" :incomeMore="data1More"
					></incomeList>
				</scroll-view>
			</swiper-item>
			<swiper-item class="overYS">
				<view class="lh60r pl40r backCol2c6739 colFff f26r">
					上月累计奖励收益：{{totalAmount2 ? totalAmount2 : 0}}元
				</view>
				<scroll-view scroll-y="true" class="hPer100C60r" @scrolltolower="orderScroll"
					:refresher-enabled="true" :refresher-triggered="data2Tri"
					@refresherrefresh="orderRefresh"
				>
					<incomeList :incomeData="data2List" :incomeMore="data2More"
					></incomeList>
				</scroll-view>
			</swiper-item>
		</swiper>
	</view>
</template>
<script>
import navbar from '@/components/navbar.vue'
import { getMemberRewardList } from '@/utils/api.js'
import incomeList from '@/components/incomeList.vue'
import { dateLimit, getXmonthNoOne } from '@/utils/utils.js'
export default {
	components: { navbar, incomeList },
	data() {
		return {
			calcNum: 0,
			timeStatus: 0,
			data0Tri: false, data0List: [], data0More: false, data0Page: 0, totalAmount0: 0,
			data1Tri: false, data1List: [], data1More: false, data1Page: 0, totalAmount1: 0,
			data2Tri: false, data2List: [], data2More: false, data2Page: 0, totalAmount2: 0,
		}
	},
	onLoad() {
		this.getDataList1(0, 0, '', '');
		this.getDataList1(0, 1, getXmonthNoOne(0), getXmonthNoOne(1));
		this.getDataList1(0, 2, getXmonthNoOne(-1), getXmonthNoOne(0));
	},
	methods: {
		goBack() {
			uni.navigateBack()
		},
		topTotalHeight(height) {
			// #ifdef MP-WEIXIN
				this.calcNum = height + 45;
			// #endif
			// #ifdef H5
				this.calcNum = 45;
			// #endif
		},
		timeSwitch(type) {
			if(this.timeStatus != type) {
				this.timeStatus = type;
			}
		},
		swiperChaFun(eee) {
			if (eee.detail.source == 'touch') {
				this.timeStatus = eee.detail.current;
			}
		},
		getDataList1(page, type, sdate, edate, callBack) {
			// uni.showLoading({ title: '加载中...' })
			getMemberRewardList({
				token: uni.getStorageSync('token'), number: 10,
				page, sdate, edate
			}).then(res => {
				console.log(res)
				if(type == 0) {
					this.totalAmount0 = res.data.amount;
					if(page > 0) {
						this.data0List = this.data0List.concat(res.data.data);
					}else {
						this.data0List = res.data.data;
					}
					if(res.data.number < 10) this.data0More = true;
				} else if(type == 1) {
					this.totalAmount1 = res.data.amount;
					if(page > 0) {
						this.data1List = this.data1List.concat(res.data.data);
					}else {
						this.data1List = res.data.data;
					}
					if(res.data.number < 10) this.data1More = true;
				} else if(type == 2) {
					this.totalAmount2 = res.data.amount;
					if(page > 0) {
						this.data2List = this.data2List.concat(res.data.data);
					}else {
						this.data2List = res.data.data;
					}
					if(res.data.number < 10) this.data2More = true;
				}
				// uni.hideLoading();
				if(callBack) callBack();
			})
		},
		orderScroll() {
			if(this.timeStatus == 0) {
				if(!this.data0More) {
					this.data0Page += 1;
					this.getDataList1(this.data0Page, 0, '', '');
				} 
			}else if(this.timeStatus == 1) {
				if(!this.data1More) {
					this.data1Page += 1;
					this.getDataList1(this.data1Page, 1, getXmonthNoOne(0), getXmonthNoOne(1));
				} 
			}else if(this.timeStatus == 2) {
				if(!this.data2More) {
					this.data2Page += 1;
					this.getDataList1(this.data2Page, 2, getXmonthNoOne(-1), getXmonthNoOne(0));
				} 
			}
		},
		orderRefresh() {
			if(this.timeStatus == 0) {
				if(!this.data0Tri) {
					this.data0Tri = true;
					this.data0More = false;
					this.data0Page = 0;
					this.getDataList1(0, 0, '', '', () => {
						this.data0Tri = false;
					});
				}
			}else if(this.timeStatus == 1) {
				if(!this.data1Tri) {
					this.data1Tri = true;
					this.data1More = false;
					this.data1Page = 0;
					this.getDataList1(0, 1, getXmonthNoOne(0), getXmonthNoOne(1), () => {
						this.data1Tri = false;
					});
				}
			}else if(this.timeStatus == 2) {
				if(!this.data2Tri) {
					this.data2Tri = true;
					this.data2More = false;
					this.data2Page = 0;
					this.getDataList1(0, 2, getXmonthNoOne(-1), getXmonthNoOne(0), () => {
						this.data2Tri = false;
					});
				}
			}
		}
	}
}
</script>
<style>
</style>